@charset "utf-8";
@import "reset";
$fs:170.66px;
html{
    font-size: $fs;
}
@function r($px){
    @return $px/$fs*1rem;
}
*{
    margin: 0;
    padding: 0;
}
body{
    background-color: #f7f7f7;
}
header {
    border-bottom: r(1px) solid #c1c1c1;
    .container {
        display: flex;
        width: 100%;
        height: r(88px);
        font-size: 0px;
        
    .item {
        font-size: r(35px);
        button {
            outline: none;
            width: r(22px);
            height: r(37px);
            font-size: r(40px);
            background-color: #f7f7f7;
            color: #848689;
        }
        }
        .item:first-of-type {
            margin-top: r(26px);
            margin-left: r(29px);
        }
        .item:last-of-type {
            margin-top: r(27px);
            margin-left: r(161px);
            color: #333333;
        }
    }
}
section{
    .Statement_of_income{
        display: flex;
        height: r(95px);
        border-top: r(1px) solid #e1e2e4;
        border-bottom: r(1px) solid #e1e2e4;
        margin-top: r(29px);
        justify-content: space-between;
        align-items: center;
        background-color:#ffffff ;
        font-size: r(26px);
        .text{
            color: #333333;
            padding-left: r(31px);
        }
        .money{
           color: #cd3333;
           padding-right: r(20px);
        }
    }
    .apple{
        display: flex;
        border-top: r(1px) solid #e1e2e4;
        border-bottom: r(1px) solid #e1e2e4;
         margin-top: r(29px);
         align-items: center;
         justify-content: space-around;
         background-color:#ffffff ;
         .apple_img{
             width: r(120px);
             height: r(120px);
             border: r(1px) solid #d7d7d7;
             font-size: 0;
             text-align: center;
             img{
                 margin-top: r(1px);
                 width: 98%;
                 height: 98%;
             }
         }
         .text{
             font-size: r(22px);
             height: r(172px);
             margin-left: r(24px);
             margin-top: r(28px);
             h3{
                 color: #333333;
                 font-weight: 500;
                 
             }
             p{
                 color: #666666;
             }
             p:first-of-type{
                 margin-top: r(15px);
                 margin-bottom: r(15px);
             }
            
         }
          .btn{
              margin-right: r(15px);
              font-size: 0;
              button{
                font-size: r(38px);
                background:#ffffff;
                color: #bfbfbf;
                outline: none;
             }
          }
    }
   
}
footer{
    .end{
        display: flex;
        height: r(69px);
        border-bottom: r(1px) solid #e1e2e4;
        align-items: center;
        background-color:#ffffff ;
        
        p{
            font-size: r(26px);
        }
        p:first-of-type{
            margin-left: r(20px);
            margin-right: r(21px);
        }
        p:nth-of-type(3){
            font-size: r(28px);
            margin-left: r(22px);
            margin-right: r(164px);
        }
    }
}
